<template>
  <span class="iconItem" @click="fullScreen">
    <el-icon><FullScreen /></el-icon>
  </span>
  <span class="iconItem" @click="toFresh">
    <el-icon><Refresh /></el-icon>
  </span>
</template>

<script lang="ts">
import screenfull from "screenfull";

export default {
  name: "RightTools",
  setup(props, { emit }) {
    //全屏
    function fullScreen(): void {
      screenfull.toggle();
    }
    //触发更新页面
    function toFresh(): void {
      emit("toFresh", null);
    }

    return {
      fullScreen,
      toFresh,
    };
  },
};
</script>

<style scoped>
.iconItem {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  float: right;
  width: 50px;
  height: 100%;
  font-size: 1.2rem;
}
.iconItem:hover {
  cursor: pointer;
  color: #409eff;
}
</style>